//get方法
/**
 * 发送GET请求
 * @param {String} url 请求地址 
 * @param {String} params 请求参数   格式：参数名=值&....&参数名=值
 * @param {Function} callback  回调函数
 * @param {Function} headersFn 自定义请求头
 * @return undefined
 */
// let t=null   //节流变量

function get(url, params, callback, headersFn = null) {
  // 创建xhr对象
  // if(t)  return
  // setTimeout(function(){   
  setTimeout(function () {
    // t=null
    const xhr = new XMLHttpRequest()
    // 监听
    xhr.onreadystatechange = function () {
      if (xhr.readyState == 4) {
        if (xhr.status == 200) {
          let res = JSON.parse(xhr.responseText)
          console.log(res)
          //callback 回调函数
          callback(res)
        } else {
          alert(xhr.status)
        }
      }
    }
    // 设置请求地址，请求数据
    xhr.open('get', `${url}?${params}`)
    // xhr.setRequestHeader('token','adf7cbdcdc62b07d94f86339e5687ca51')
    if (headersFn) headersFn(xhr)

    // 发送请求
    xhr.send(null)
  }, 2000)
}
// 百度搜索框
//获取input框绑定值改变事件
document.querySelector('.box input').oninput = function () {
  //事件处理函数中，写ajax 4步骤 向后端获取数据
  let iptcontent = this.value
  //调用get方法
  get('http://www.baidu.com/sugrec', `prod=pc&wd=${iptcontent}`, res => {
    //清空之前的ulul
    let ulobj = document.querySelector('.box ul')
    //遍历-造li -追加到ul
    ulobj.innerText = ''
    if (res.g) {
      res.g.forEach((item, i) => {
        let liobj = document.createElement('li')
        liobj.innerText = item.q
        document.querySelector('.box ul').appendChild(liobj)
      })
    }
  }), xhr => { }
}

// post方法
/**
* 发送POST请求
* @param {String} url 请求地址 
* @param {String} params 请求参数   格式：参数名=值&....&参数名=值
* @param {Function} callback  回调函数
* @param {Function} headersFn 自定义请求头
* @return undefined
*/
function post(url, params, callback, headersFn = null) {
  // 创建xhr对象
  const xhr = new XMLHttpRequest()
  //监听请求状态
  xhr.onreadystatechange = function () {
    // 判断返回数据
    if (xhr.readyState == 4) {
      //判断返回的状态码
      if (xhr.status === 200) {
        let res = JSON.parse(xhr.responseText)
        console.log(res)
        callback(res)
      } else {
        alert(xhr.status)
      }
    }
  }
  //设置请求方式，请求地址
  xhr.open('post', url)
  xhr.setRequestHeader('content-type', 'application/x-www-form-urlencoded')
  xhr.setRequestHeader('token', 'adf7cbdcdc62b07d94f86339e5687ca51')
  if (headersFn) headersFn(xhr)
  //  发送
  xhr.send(params)
}

// 添加角色  调用post方法
// 后去点击按钮，绑定点击事件
document.querySelector('.box2 button').onclick = function () {
  // 调用post()方法
  let role_name = document.querySelector('textarea').value
  post('http://kg.zhaodashen.cn/v2/roles/create.php', `role_name=${role_name}`, res => {
    if (res.meta.state == 201) {
      alert("角色已创建好了！！！")
    } else {
      alert(res.meta.msg)
    }
  }), xhr => { }
}

